<template>
  <div>
    <el-button type="primary" icon="el-icon-plus" style="margin: 5px 0 5px 5px" @click="handleAdd">添加</el-button>
    <!-- <el-button type="primary" icon="el-icon-plus" style="margin: 5px 0 5px 5px" @click="addGoodsFormTt">从抖店添加商品 -->
    <!-- </el-button> -->
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        fixed
        prop="name"
        label="商品名称"
        align="center"
        width="150">
      </el-table-column>
      <el-table-column
        prop="price"
        label="价格"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        label="图片"
        align="center"
        width="120">
        <template slot-scope="scope">
          <el-image
            style="width: 100px; height: 100px"
            :src="scope.row.image"
            fit="cover"></el-image>
        </template>
      </el-table-column>
      <!--<el-table-column
        prop="minePrice"
        label="自购价"
        align="center"
        width="120">
      </el-table-column>-->
      <el-table-column
        prop="model"
        label="店铺"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        prop="commission"
        label="活动佣金率"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        prop="sales"
        label="销量"
        align="center"
        width="100">
      </el-table-column>
      <el-table-column
        prop="fansNum"
        label="要求粉丝"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        prop="receiveNum"
        label="可领取数量"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        prop="remainNum"
        label="剩余数量"
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        label="活动时间"
        align="center"
        width="310">
        <template slot-scope="scope">
          {{dateFormat(scope.row.start)}}-{{dateFormat(scope.row.end)}}
        </template>
      </el-table-column>
      <el-table-column
        prop="shopName"
        label="商铺名称"
        align="center"
        width="120">
      </el-table-column>
      </el-table-column>
      <el-table-column
        fixed="right"
        label="操作"
        width="100">
        <template slot-scope="scope">
          <!--<el-button @click="handleExit(scope.row)" type="text" size="small">编辑</el-button>-->
          <el-button @click="handleDelete(scope.row)" type="text" size="small">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[10]"
      :page-size="10"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>

    <el-dialog title="编辑" :visible.sync="exitDialogForm">
      <el-form :model="exitForm">
        <el-row>
          <el-col>
            <el-form-item label="商品名">
              <el-input v-model="exitForm.name"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="价格">
              <el-input type="number" v-model="exitForm.price"></el-input>
            </el-form-item>
          </el-col>
          <!--<el-col :span="9" style="margin-left: 70px">
            <el-form-item label="自购价">
              <el-input type="number" v-model="exitForm.minePrice"></el-input>
            </el-form-item>-->
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
            <el-form-item label="可领取数量">
              <el-input type="number" v-model="exitForm.receiveNum"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="9" style="margin-left: 70px">
            <el-form-item label="佣金">
              <el-input type="number" v-model="exitForm.commission">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
            <!--淘宝、抖店、拼多多-->
            <el-form-item label="店铺">
              <el-select v-model="exitForm.model" placeholder="请选择">
                <el-option
                  v-for="item in shopOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="9" style="margin-left: 70px">
            <el-form-item label="分类">
              <el-select v-model="exitForm.categoryId" placeholder="请选择" @focus="handleCategory">
                <el-option
                  v-for="item in categoryOptions"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="商品URL">
              <el-input v-model="exitForm.goodsUrl"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="卖点">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                maxlength="30"
                show-word-limit
                v-model="exitForm.characteristic">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="活动时间">
              <el-date-picker
                v-model="exitForm.date"
                type="datetimerange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
            <el-form-item label="店铺名称">
              <el-input v-model="exitForm.shopName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="9" style="margin-left: 70px">
            <el-form-item label="要求粉丝数量">
              <el-input type="number" v-model="exitForm.fansNum"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="添加" :visible.sync="addDialogForm" :close-on-click-modal="false">
      <el-form :model="addForm" :rules="addRules" ref="addRuleForm">
        <el-row>
          <el-col>
            <el-form-item label="商品名" prop="name">
              <el-input v-model="addForm.name"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="11">
            <el-form-item label="价格" prop="price">
              <el-input type="number" v-model="addForm.price"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11" style="margin-left: 13px">
            <el-form-item label="可领取数量(注：可提供给达人的总计样品数量)" prop="receiveNum">
              <el-input type="number" v-model="addForm.receiveNum"></el-input>
            </el-form-item>
          </el-col>
          <!--<el-col :span="9" style="margin-left: 70px">
            <el-form-item label="自购价">
              <el-input type="number" v-model="addForm.minePrice"></el-input>
            </el-form-item>
          </el-col>-->
        </el-row>
        <el-row>
          <el-col :span="11">
            <el-form-item label="活动佣金率" prop="commission">
              <el-input type="number" v-model="addForm.commission">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11" style="margin-left: 13px">
            <el-form-item label="招商服务费率" prop="businCommission">
              <el-input type="number" v-model="addForm.businCommission">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
            <!--淘宝、抖店、拼多多-->
            <el-form-item label="店铺" prop="model">
              <el-select v-model="addForm.model" placeholder="请选择">
                <el-option
                  v-for="item in shopOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="9" style="margin-left: 70px">
            <el-form-item label="分类" prop="categoryId">
              <el-select v-model="addForm.categoryId" placeholder="请选择" @focus="handleCategory">
                <el-option
                  v-for="item in categoryOptions"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="商品链接" prop="goodsUrl">
              <el-input v-model="addForm.goodsUrl"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="头图上传" prop="image">
              <!-- <el-input v-model="addForm.goodsUrl"></el-input> -->
              <el-input v-if="false" v-model="addForm.image"/>
              <el-upload
                class="upload-demo"
                name="multipartFile"
                :before-upload="beforeImageUpload"
                :on-success="onSuccess"
                action="http://zs.91gongju.cn:10003/utils/upload/img">
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip line-height-tip">1.
                  主图最多1张图片，主图图片应包含商品正反面外包装图，若涉及活动，图片上需清晰体现活动时间和活动方式，需审核通过后生效。<br>2.
                  仅支持png，jpg，jpeg格式；建议上传1:1的图片，图片至少600*600，图片大小不超过400k。
                </div>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="卖点" prop="characteristic">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                maxlength="30"
                show-word-limit
                v-model="addForm.characteristic">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="活动时间" prop="date">
              <el-date-picker
                v-model="addForm.date"
                type="datetimerange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9">
            <el-form-item label="店铺名称" prop="shopName">
              <el-input v-model="addForm.shopName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="9" style="margin-left: 70px">
            <el-form-item label="要求粉丝数量" prop="fansNum">
              <el-input type="number" v-model="addForm.fansNum"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addDialogForm = false;this.$refs.upload.clearFiles();">取 消</el-button>
        <el-button type="primary" @click="handleSubmit">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="从抖店添加商品"
      :visible.sync="dialogVisible"
      width="80%">
      <div>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-table
              ref="multipleTable"
              :data="tableData"
              tooltip-effect="dark"
              style="width: 100%"
              @selection-change="handleSelectionChange">

              <el-table-column
                prop="name"
                label="标题">
              </el-table-column>
              <el-table-column
                label="头图"
                show-overflow-tooltip>
                <template slot-scope="scope">
                  <el-image
                    style="width: 80px; height: 80px"
                    :src="scope.row.image">
                  </el-image>
                </template>
              </el-table-column>
              <el-table-column
                prop="price"
                label="价格">
              </el-table-column>
              <el-table-column
                label="操作">
                <template slot-scope="scope">
                  <el-button @click="closeDialog(scope.row)">
                    添加
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
        <el-dialog
          width="100%"
          title="添加完善商品基本信息"
          :visible.sync="innerVisible"
          append-to-body>
          <div>
            <el-form :model="addForm">
              <el-row>
                <el-col>
                  <el-form-item label="商品名">
                    <el-input v-model="addForm.name"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="价格">
                    <el-input type="number" v-model="addForm.price"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="可领取数量">
                    <el-input type="number" v-model="addForm.receiveNum"></el-input>
                  </el-form-item>
                </el-col>
                <!--<el-col :span="9" style="margin-left: 70px">
                  <el-form-item label="自购价">
                    <el-input type="number" v-model="addForm.minePrice"></el-input>
                  </el-form-item>
                </el-col>-->
              </el-row>
              <el-row>
                <el-col :span="12" style="margin-left: 70px">
                  <el-form-item label="活动佣金率">
                    <el-input type="number" v-model="addForm.commission">
                      <template slot="append">%</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12" style="margin-left: 70px">
                  <el-form-item label="招商服务费率">
                    <el-input type="number" v-model="addForm.businCommission" style="width: 100px">
                      <template slot="append">%</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="9">
                  <!--淘宝、抖店、拼多多-->
                  <el-form-item label="店铺">
                    <el-select v-model="addForm.model" placeholder="请选择">
                      <el-option
                        v-for="item in shopOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="9" style="margin-left: 70px">
                  <el-form-item label="分类">
                    <el-select v-model="addForm.categoryId" placeholder="请选择" @focus="handleCategory">
                      <el-option
                        v-for="item in categoryOptions"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="商品URL">
                    <el-input v-model="addForm.goodsUrl"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-image
                    style="width: 80px; height: 80px;"
                    :src="addForm.image">
                  </el-image>
                  <el-form-item label="图片URL">
                    <el-input v-model="addForm.image"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="卖点">
                    <el-input
                      type="textarea"
                      :rows="2"
                      placeholder="请输入内容"
                      maxlength="30"
                      show-word-limit
                      v-model="addForm.characteristic">
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="活动时间">
                    <el-date-picker
                      v-model="addForm.date"
                      type="datetimerange"
                      range-separator="至"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="9">
                  <el-form-item label="店铺名称">
                    <el-input v-model="addForm.shopName"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="9" style="margin-left: 70px">
                  <el-form-item label="要求粉丝数量">
                    <el-input type="number" v-model="addForm.fansNum"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
    <el-button @click="innerVisible = false">取 消</el-button>
    <el-button type="primary" @click="innerCloseDialog">确 定</el-button>
  </span>
        </el-dialog>
      </div>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
    </el-dialog>

    <el-dialog
      title="打开微信扫一扫"
      :visible.sync="ticketDialog"
      :close-on-click-modal="false"
      :before-close="handleClose"
      width="25%"
      center>
      <el-image
        style="width: 100%;height: 100%;"
        :src="this.ticket"
        fit="cover"></el-image>
      <div style="color: #999;text-align: center;font-size: 20px">关注公众号</div>
      <div style="color: #999;text-align: center;font-size: 20px">追踪推广进度</div>
      <div style="color: #999;text-align: center;font-size: 20px">获取专属客服一对一支持</div>
    </el-dialog>
  </div>
</template>

<script>
  import {getToken} from '@/utils/cookie'
  import ElRow from "element-ui/packages/row/src/row";
  import ElCol from "element-ui/packages/col/src/col";
  export default {
    components: {
      ElCol,
      ElRow
    },
    data() {
      return {
        selectVal: [],
        tTtableData: [],
        innerVisible: false,
        dialogVisible: false,
        exitDialogForm: false,
        addDialogForm: false,
        ticketDialog: false,
        tableData: [],
        ticket: '',
        currentPage: 0,
        total: 0,
        GoodsQueryVo: {},
        exitForm: {},
        addForm: {},
        shopOptions: [{
          value: '淘宝',
          label: '淘宝'
        },
          {
            value: '抖店',
            label: '抖店'
          },
          {
            value: '拼多多',
            label: '拼多多'
          }],
        categoryOptions: [],
        addRules: {
          name: [
            {required: true, message: '请输入商品名', trigger: 'blur'},
          ],
          price: [
            {required: true, message: '请输入价格', trigger: 'blur'},
          ],
          receiveNum: [
            {required: true, message: '请输入可领取数量', trigger: 'blur'},
          ],
          commission: [
            {required: true, message: '请输入活动佣金率', trigger: 'blur'},
            {pattern: /^(1|[1-9]\d?|100)$/, message: '范围在1-100'}
          ],
          businCommission: [
            {required: true, message: '请输入招商服务费率', trigger: 'blur'},
            {pattern: /^(1|[1-9]\d?|100)$/, message: '范围在1-100'}
          ],
          model: [
            {required: true, message: '请选择店铺', trigger: 'change'},
          ],
          categoryId: [
            {required: true, message: '请选择分类', trigger: 'change'},
          ],
          goodsUrl: [
            {required: true, message: '请输入商品链接', trigger: 'blur'},
          ],
//          image: [
//            {required: true, message: '请输入活动名称', trigger: 'blur'},
//          ],
          characteristic: [
            {required: true, message: '请输入卖点', trigger: 'blur'},
          ],
          date: [
            {required: true, message: '请输入活动时间', trigger: 'blur'},
          ],
          shopName: [
            {required: true, message: '请输入店铺名称', trigger: 'blur'},
          ],
          fansNum: [
            {required: true, message: '请输入要求粉丝数量', trigger: 'blur'},
          ],
        }
      }
    },
    created() {
      this.getGoodsList()
    },
    methods: {
      beforeImageUpload(file) {
        console.log(file);
        //console.log(file);
        const isTypeTrue = /^image\/(jpeg|png|jpg)$/.test(file.type);
        if (!isTypeTrue) {
          this.$message.error("上传图片格式不对!");
          return false;
        }
        const isLt2M = file.size / 1024 < 400;
        if (this.addForm.image != null) {
          this.$message.error("不可重复上传");
          return false;
        }
        if (!isLt2M) {
          this.$message.error("上传头像图片大小不能超过 400KB!");
        }
        return isLt2M
      },
      onSuccess(response, file, fileList) {
        if (response.code == 200) {
          this.addForm.image = response.msg;
        } else {
          this.$message("上传失败")
        }
      },
      toAuth() {
        this.$confirm('此操作请确保你电脑已经登录抖店, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
          this.$http.get(`/doudian/auth`).then((res) => {
            console.log(res.data.data)
            window.location.href = res.data.data;
          })
        }).catch(() => {

        });
      },
      addGoodsFormTt(current = 0) {
        // 发送请求获取绑定抖店的数据
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.get(`/goods/getGoodsList/${current}/${8}`).then((res) => {
          console.log(res.data)
          let data = res.data;
          if (data.code == 500) {
            this.toAuth();
            this.$message({message: "抖店未授权"})
          } else {
            this.dialogVisible = true;
            this.tTtableData = [];
          }
        })
      },
      innerCloseDialog() {
        this.innerVisible = false;
        this.dialogVisible = false;
        this.selectVal = [];
        this.$refs.multipleTable.clearSelection();
        this.addOnSubmit();
      },
      handleSelectionChange(val) {
        this.selectVal = [];
        val.forEach(item => {
          this.selectVal.push(item);
        });
      },
      closeDialog(row) {
        this.selectVal = [];
        this.selectVal.push(row);
        this.addForm = {
          name: row.name,
          price: row.price,
          model: '抖店',
          goodsUrl: row.goodsUrl,
          shopName: row.shopName,
          image: "https://sf6-ttcdn-tos.pstatp.com/obj/temai/95ecab279583f0dd97661f78a3ba38f2www801-1050"
        }
        this.innerVisible = true;
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        this.currentPage = val
        this.getGoodsList()
        console.log(`当前页: ${val}`);
      },
      getGoodsList(){
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.post(`/goods/admin/list/${this.currentPage}`).then((res) => {
          this.total = res.data.data.total
          this.tableData = res.data.data.list
          console.log(this.tableData)
        })
      },
      addOnSubmit(){
        this.addForm.start = this.addForm.date[0]
        this.addForm.end = this.addForm.date[1]
        this.addForm.minePrice = this.toDecimal2(this.addForm.minePrice)
        this.addForm.price = this.toDecimal2(this.addForm.price)
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.post(`/goods/save`, this.addForm).then((res) => {
          if (res.data.code === 200) {
            this.addDialogForm = false
            this.$message.success('添加成功')
            this.getGoodsList()
            this.ticketDialog = false;
          } else {
            this.$message.error(res.data.msg)
          }
        })
      },
      handleAdd(){
        this.addForm = {}
        this.addDialogForm = true
      },
      handleExit(){
        this.exitDialogForm = true
      },
      handleDelete(val){
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.delete(`/goods/delete/${val.id}`).then((res) => {
          if (res.data.code === 200) {
            this.$message.success(res.data.msg)
            this.getGoodsList()
          } else {
            this.$message.error("删除失败")
            this.getGoodsList()
          }
        })
      },
      handleCategory(){
        this.$http.defaults.headers.common['Authorization'] = ''
        this.$http.get(`/goods/category/list`).then((res) => {
          console.log(res)
          this.categoryOptions = res.data.data
        })
      },
      handleTicket(){
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.get(`/weixin/getUserId`).then((res) => {
          this.$http.post(`/weixin/getTicket/${ res.data.data + ''}`).then((res) => {
            const result = res.data
            this.ticket = result.data.ticket
          })
        })
      },
      handleSubmit(){
        clearTimeout(this.time);
        this.$refs.addRuleForm.validate(valid => {
          if (!valid) {
            this.$message.error('请安要求填写数据')
          } else {
            this.ticketDialog = true;
            this.handleTicket();
            this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
            this.$http.get(`/weixin/getUserId`).then((res) => {
              this.$http.get(`/wx/user/${res.data.data}`).then((res) => {
                console.log(res.data.data)
                if (res.data.data === 0) {
                  this.getUser();
                } else {
                  this.ticketDialog = false;
                  this.addOnSubmit();
                }
              })
            })
          }
        })
      },
      getUser(){
        this.$http.defaults.headers.common['Authorization'] = 'Bearer ' + getToken()
        this.$http.get(`/weixin/getUserId`).then((res) => {
          this.$http.get(`/wx/user/${res.data.data}`).then((res) => {
            console.log('1', res)
            if (res.data.data === 0) {
//              this.timer = setTimeout(this.getUser(val), 3000);
              this.time = setTimeout(this.getUser, 3000);
            } else {
              clearTimeout(this.time);
              this.ticketDialog = false;
              this.addOnSubmit();
            }
          })
        })
      },
      dateFormat: function (time) {
        var date = new Date(time);
        var year = date.getFullYear();
        /* 在日期格式中，月份是从0开始的，因此要加0
         * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
         * */
        var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
        var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
        var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
        var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        // 拼接
        return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
      },
      toDecimal2(x) {
        var f = parseFloat(x);
        if (isNaN(f)) {
          return false;
        }
        var f = Math.round(x * 100) / 100;
        var s = f.toString();
        var rs = s.indexOf('.');
        if (rs < 0) {
          rs = s.length;
          s += '.';
        }
        while (s.length <= rs + 2) {
          s += '0';
        }
        return s;
      }
    },
    handleClose(){
      clearTimeout(this.time);
      this.addInfo = {}
      this.ticketDialog = false;
      this.isLoading = false;
    }
  }
</script>

<style>
  .line-height-tip {
    line-height: 15px;
    font-size: 8px;
    color: grey;
  }
</style>
